<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>消息提醒</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/layer/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/static/css/font-awesome.min.css" media="all">
    <link rel="stylesheet" href="/static/ucss/admin/app.css" media="all"/>
    <link rel="stylesheet" href="/static/ucss/admin/themes/default.css" media="all" id="skin" shs-skin/>
    <style>
        .layui-tab-title li {
            position: relative;
            line-height: 40px;
            min-width: 300px;
            padding: 0 15px;
            text-align: center;
            cursor: pointer;
        }

        #ones {
            text-align: center;
        }

        #notices {
            text-align: center;
        }
        .col_class{
            padding: 1rem 1rem 1rem 5rem;
            font-size: 17px;
        }
    </style>
</head>
<body>
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief" style=" margin-bottom: 0px;">
   <!-- <ul class="layui-tab-title" align='center' id="uls">
        <li id="lis" class="layui-this"><span class="message-count"></span></li>
      &lt;!&ndash;  <li id="li">公告<span class="notice-count"></span></li>&ndash;&gt;
    </ul>-->
    <div class="layui-tab-content">
        <div class="layui-tab-item layui-show  one">
            <div id="xiaoxi">

                <!--<div class="xiaoxi">
                    <div class="layui-row">
                        <input type="hidden" class="id" name="id" value="res.data[i].ID"/>
                        <input type="hidden" class="id" name="names" value="res.data[i].ID"/>
                        <div class="layui-col-xs8" style="padding-left: 50px;padding-top: 10px;">
                            <div ><span>res.data[i].TITLE</span></div>
                            <div class="one" style=" padding-top: 8px;"><span style="font-size:12px ">res.data[i].ZDRQ</span></div>
                        </div>
                        <div class="layui-col-xs1">
                        </div>
                        <div class="layui-col-xs3" style="padding-left: 50px;padding-top: 10px;">
                            <div><span>res.data[i].CDATE</span></div>
                            <div><span>res.data[i].TJR</span></div>
                        </div>
                    </div>
                    <div style=" padding-top: 15px;"><hr/></div>
                </div>-->

            </div>
            <ul id="ones"></ul>
        </div>
        <div class="layui-tab-item  two" id="two">
            <div id="notice">

                <!--<div class="notice">
                                  <div class="layui-row">
                                      <input type="hidden" class="id" name="id" value="'+item.MESSAGE_ID+'"/>
                                      <input type="hidden" class="id" name="names" value=""/>
                                      <div class="layui-col-xs8" style="padding-left: 50px;padding-top: 10px;">
                                          <div class="one" style=" padding-top: 8px;"><span style="font-size:14px;color:red; ">'+item.TITLE+'</span></div>
                                      </div>
                                      <div class="layui-col-xs1">
                                      </div>
                                      <div class="layui-col-xs3" style="padding-left: 50px;padding-top: 20px;">
                                          <div><span style="font-size:13px;color:red; ">'+item.CREATE_TIME+'</span></div>
                                      </div>
                                  </div>
                                  <div style=" padding-top: 15px;"><hr/></div>
                              </div>

                          </div>
                          <div  id="twos"></div>
                      </div>
                  </div>-->


            </div>
            <ul id="notices"></ul>
        </div>
    </div>
</div>
<script type="text/javascript" src="../../static/layer/layui.js"></script>
<script type="text/javascript" src="../../static/js/common/queryUtils.js"></script>
<script>
    var $="";
    var layer="";
    var laypage="";
    var laytpl="";

    layui.use(['table', 'element', 'jquery', 'layer', 'laydate', 'form', 'laypage','laytpl'], function () {
        $ = layui.jquery; layer = layui.layer; laypage = layui.laypage ; laytpl = layui.laytpl;
        //初始化分页===========================
        //fixme 只有新建待审核 和退租待审核 待增加 2018年3月16日 11:31:33
        //查询反馈
        $(function () {
            xiaoxi();//初始化消息
          //  gonggao();//初始化公告
        });
    });

    function xiaoxi() {
        //消息列表查询
        $.ajax({
            url: "/financial/findAllMessage",
            dataType: "json",
            type: "post",
            async: false,
            success: function (res) {
                debugger
                var length =  res.data.length;

                /*$(".sysMessage",parent.document).html(length); //  j*/
                $("#xiaoxi").html("");
                var getbTpr = $("#xiaoxi_temp").html();
                var bviewr = document.getElementById('xiaoxi');
                laytpl(getbTpr).render(res, function (html) {
                    bviewr.innerHTML = html;
                });

            }
        });
    };

    function gonggao() {
        //广告列表查询
        $.ajax({
            url: "/financial/noticejson",
            //data: {page:currentPage, limit:limit},
            dataType: "json",
            type: "post",
            //contentType : 'application/json;charset=UTF-8',
            async: false,
            success: function (res) {
                if (res.errcode === "0") {
                    var data = res.data;
                    var num = 0;
                    if (res.data.length > 0) {
                        for (var i = 0; i < res.data.length; i++) {
                            if (res.data[i].IS_READ == "0") {
                                num++;
                            }
                        }
                        $(".notice-count").html("(" + num + ")");
                    }
                    //调用分页
                    laypage.render({
                        elem: 'notices'
                        , count: res.data.length
                        , limit: 20
                        , jump: function (obj) {
                            //模拟渲染
                            document.getElementById('notice').innerHTML = function () {
                                var arr = []
                                    , thisData = data.concat().splice(obj.curr * obj.limit - obj.limit, obj.limit);
                                layui.each(thisData, function (index, item) {
                                    if (item.IS_READ === 0) {//是否已读0未读读1已读
                                        var str = '<div class="notice">\n' +
                                            '                                   <div class="layui-row">\n' +
                                            '                                       <input type="hidden" class="id" name="id" value="' + item.MESSAGE_ID + '"/>\n' +
                                            '                                       <input type="hidden" class="id" name="names" value=""/>\n' +
                                            '                                       <div class="layui-col-xs8" style="padding-left: 50px;padding-top: 10px;">\n' +
                                            '                                           <div class="one" style=" padding-top: 8px;"><span style="font-size:14px;color:red; ">' + item.TITLE + '</span></div>\n' +
                                            '                                       </div>\n' +
                                            '                                       <div class="layui-col-xs1">\n' +
                                            '                                       </div>\n' +
                                            '                                       <div class="layui-col-xs3" style="padding-left: 50px;padding-top: 20px;">\n' +
                                            '                                           <div><span style="font-size:13px;color:red;white-space: nowrap; ">' + item.CREATE_TIME + '</span></div>\n' +
                                            '                                       </div>\n' +
                                            '                                   </div>\n' +
                                            '                                   <div style=" padding-top: 15px;"><hr/></div>\n' +
                                            '                               </div>\n' +
                                            '\n' +
                                            '                           </div>\n' +
                                            '                           <div  id="twos"></div>\n' +
                                            '                       </div>\n' +
                                            '                   </div>';

                                        arr.push(str);
                                    } else {
                                        var str = '<div class="notice">\n' +
                                            '                    <div class="layui-row">\n' +
                                            '                        <input type="hidden" class="id" name="id" value="' + item.MESSAGE_ID + '"/>\n' +
                                            '                        <input type="hidden" class="id" name="names" value=""/>\n' +
                                            '                        <div class="layui-col-xs8" style="padding-left: 50px;padding-top: 10px;">\n' +
                                            '                            <div class="one" style=" padding-top: 8px;"><span style="font-size:14px;">' + item.TITLE + '</span></div>\n' +
                                            '                        </div>\n' +
                                            '                        <div class="layui-col-xs1">\n' +
                                            '                        </div>\n' +
                                            '                        <div class="layui-col-xs3" style="padding-left: 50px;padding-top: 20px;">\n' +
                                            /* '                            <div><span style="font-size:12px; "></span></div>\n' +*/
                                            '                            <div><span style="font-size:12px;white-space: nowrap;">' + item.CREATE_TIME + '</span></div>\n' +
                                            '                        </div>\n' +
                                            '                    </div>\n' +
                                            '                    <div style=" padding-top: 15px;"><hr/></div>\n' +
                                            '                </div>';
                                        arr.push(str);
                                    }
                                });
                                return arr.join('');
                            }();
                            //公告的跳转页面
                            $(".notice").click(function () { //添加跳转页面的单击事件
                                var id = $(this).find("input[name='id']").val();//公告的ID
                                parent.layer.open({
                                    zIndex: 1005,
                                    type: 2,    //弹出类型
                                    title: '公告内容',   //标题
                                    closeBtn: 1,    //显示关闭按钮
                                    shade: [0.3],   //遮罩透明度
                                    area: ['65%', '90%'],  //打开窗口的宽高
                                    time: 0,    //几秒后自动关闭，默认0时不关闭
                                    anim: 1,    //动画效果
                                    resize: false,  //设置成不允许拉伸
                                    content: '../../../webhtml/message/see_notice.html?NOTICE_ID=' + id + ''  //iframe的url
                                });
                                $.ajax({
                                    url: "/sysMessage/updatenotice",
                                    data: {ID: id},
                                    dataType: "json",
                                    type: "post",
                                    async: false,
                                    success: function (res) {
                                        if (res.errcode === "0") {
                                        } else if (res.errcode === "1") {
                                            layer.msg(res.errmsg, function () {
                                            });
                                        }
                                    },
                                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                                        console.error(XMLHttpRequest.status);
                                        console.error(XMLHttpRequest.readyState);
                                        console.error(textStatus);
                                    }
                                });
                                $(this).find("span").css("color", "#626262");//设置颜色
                                location.reload();
                            });
                        }
                    });
                } else if (res.errcode === "1") {
                    layer.msg(res.errmsg, function () {
                    });
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                console.error(XMLHttpRequest.status);
                console.error(XMLHttpRequest.readyState);
                console.error(textStatus);
            }
        });
    };
</script>

<!--消息-->
<script id="xiaoxi_temp" type="text/html">
    {{#  layui.each(d.data, function(index, item){ }}
        <div class="xiaoxi">
            <div class="layui-row">
                <div class="layui-col-xs6">
                    <div   class="col_class"><span>{{item.TITLE}}</span></div>
                    <div  class="col_class"><span >{{item.TOTAL_PRICE}}</span></div>
                </div>
                <div class="layui-col-xs1">
                </div>
                <div class="layui-col-xs5" >
                    <div  class="col_class"><span>{{item.F_DATE}}</span></div>
                    <div  class="col_class"><span>创建人：{{item.NAME}}</span></div>
                </div>
            </div>
            <div style=" padding-top: 15px;"><hr/></div>
        </div>
    {{#  }); }}
</script>
</body>
</html>